<?php
//======================================================================================
//
// Function: Maintain HUB_LOG
//
// Programmer: AR
// Date : 2024-07-18
//
// Copyright Reeft A/S (c) - 2024
//======================================================================================
// https://stackoverflow.com/questions/56062658/clicking-programmatically-on-the-arrows-of-html-inputs-type-number
// https://datatables.net/manual/server-side
// https://datatables.net/examples/data_sources/server_side
//======================================================================================
// Get input
//======================================================================================
//======================================================================================
// Make line uppercase
//======================================================================================
//======================================================================================
// General config
//======================================================================================
include "config/config.php";
//======================================================================================
// Check if user is logged in?
//======================================================================================
include "login_check.php";
//======================================================================================
// Get session variables
//======================================================================================
include "include/getsession.php";
// include "include/uuid_create.php";
// include "include/generate_password_md5.php";
//======================================================================================
// Set language
//======================================================================================
include "include/set_language.php";
//======================================================================================
// Set defaults
//======================================================================================
// $pk_reference = $_SESSION['session_dft_pk_reference'];
// $referenceCode = $_SESSION['session_dft_referencecode'];
// $referenceName = $_SESSION['session_dft_referencename'];
//======================================================================================
?>
<!DOCTYPE html>
<html lang="en">
<head>
<title><?php echo $datahub_text0001 ?></title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="REEFTvisual - Stoptime">
<meta name="author" content="REEFT A/S">
<link rel="icon" href="images/favicon/favicon.ico">
<!-- Bootstrap / jQuery -->
<link href="css/bootstrap4.3.1/css/bootstrap.custom.min.css" rel="stylesheet">
<link href="css/bootstrap4.3.1/css/themes/bootstrap.custom.min.css" rel="stylesheet">
<link href="css/bootstrap4.3.1/css/normalize.css" rel="stylesheet" type="text/css">
<link href="css/sticky-footer.css" rel="stylesheet" type="text/css">
<!-- Custom styles for this template -->
<link href="css/custom.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<script src="css/fontawesome6.5.1/js/all.min.js"></script>
<script src="css/fontawesome6.5.1/js/sharp-light.min.js"></script>
<script src="css/fontawesome6.5.1/js/sharp-regular.min.js"></script>
<script src="css/fontawesome6.5.1/js/sharp-solid.min.js"></script>
<script src="css/fontawesome6.5.1/js/sharp-thin.min.js"></script>
<link href="css/bootstrap_animation/css/animate4/animate.css" rel="stylesheet" type="text/css">
<!--<link href="javascript/chosen/chosen.css" rel="stylesheet" type="text/css">-->
<link href="javascript/jquery-ui/jquery-ui.min.css" rel="stylesheet" type="text/css"/>
<script src="javascript/jquery.js"></script>
<script src="css/bootstrap4.3.1/js/popper.js"></script>
<script src="css/bootstrap4.3.1/js/bootstrap.min.js"></script>
<script src="javascript/jquery-ui/jquery-ui.min.js"></script>
<script src="javascript/jquery.ui.touch-punch.min.js"></script>
<link href="javascript/bgrins-spectrum/spectrum.css" rel="stylesheet" type="text/css">
<script src="javascript/bgrins-spectrum/spectrum.js"></script>
<script src="javascript/moment.min.js"></script>
<script src="javascript/moment-with-locales.min.js"></script>
<script src="javascript/moment-duration-format.min.js"></script>
<script src="javascript/number_format/jquery.number.min.js"></script>
<script src="javascript/jquery.scrollTo.min.js"></script>
<link href="javascript/daatatables/media/css/jquery.dataTables.min.css" rel="stylesheet" type="text/css">
<link href="javascript/daatatables/media/css/fixedHeader.dataTables.min.css" rel="stylesheet" type="text/css">
<link href="javascript/daatatables/Buttons-1.4.2/css/buttons.dataTables.min.css" rel="stylesheet" type="text/css">
<script src="javascript/daatatables/media/js/jquery.dataTables.min.js"></script>
<script src="javascript/daatatables/media/js/dataTables.fixedHeader.min.js"></script>
<script src="javascript/daatatables/Buttons-1.4.2/js/dataTables.buttons.min.js"></script>
<script src="javascript/daatatables/Buttons-1.4.2/js/buttons.flash.min.js"></script>
<script src="javascript/daatatables/JSZip-2.5.0/jszip.min.js"></script>
<script src="javascript/daatatables/pdfmake-0.1.53/pdfmake.min.js"></script>
<script src="javascript/daatatables/pdfmake-0.1.53/vfs_fonts.js"></script>
<script src="javascript/daatatables/Buttons-1.4.2/js/buttons.html5.min.js"></script>
<script src="javascript/daatatables/Buttons-1.4.2/js/buttons.print.min.js"></script>
<script src="javascript/chosen/chosen.jquery.min.js" type="text/javascript"></script>
<script src="javascript/viewer-master/dist/viewer.min.js"></script>
<link href="javascript/viewer-master/dist/viewer.min.css" rel="stylesheet">
<script src="javascript/ajaxq/ajaxq.js"></script>
<link id="scrollUpTheme" rel="stylesheet" href="javascript/scrollup-master/dist/css/themes/image.css">
<script src="javascript/scrollup-master/dist/jquery.scrollUp.js"></script>
<script src="javascript/shortcut.js"></script>
<script src="javascript/_reeft_js/set_font_awesome_icon_type.js"></script>
<script src="javascript/_reeft_js/date_convert.js"></script>
<style>
.btn-custom-wide {
height:60px;
width:210px;
}
.text-truncate-dt {
max-width: 450px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.modal-xxl {
max-width: 80%;
}
.modal-xl {
max-width: 50%;
}
.border-3 {
border-width:3px !important;
}
td .hover-img {
position:relative;
}
td .hover-img span {
position:absolute; left:-9999px; top:-9999px; z-index:9999;
}
td:hover .hover-img span {
top: 5px;
left:0px;
}
.chosen-container-single {
min-width: 100%;
}
</style>
<script language="JavaScript">
//=============================================================================
// Globals
//=============================================================================
var thisCurrentRow;
var thisGlobalRowData;
var thisGlobalTableData;
// date variables
var input_fromdate;
var input_fromtime;
var input_todate;
var input_totime;
var global_debug = 'N';
// Add allowed Y/N
var GLOBAL_ADD_ALLOWED = 'N';
// Delete allowed Y/N
var GLOBAL_DELETE_ALLOWED = 'N';
// sortMode
var GLOBAL_SORTMODE = 'DESC';
var jsonDataSave = {};
var DFT_DATE_DISPLAY_FORMAT = '<?php //echo $DFT_DATE_DISPLAY_FORMAT ?>';
var DFT_LANGUAGE = '<?php //echo $DFT_LANGUAGE ?>';
var GLOBAL_TOTALPAGESSTOPVALUE = 10;
// Save field
//var save_CFGNAM = '';
$(function () {
$.scrollUp({
scrollName: 'scrollUp', // Element ID
//topDistance: '1800', // Distance from top before showing element (px)
//topSpeed: 300, // Speed back to top (ms)
scrollDistance: '300', // Distance from top before showing element (px)
scrollSpeed: 300, // Speed back to top (ms)
animation: 'fade', // Fade, slide, none
animationInSpeed: 200, // Animation in speed (ms)
animationOutSpeed: 200, // Animation out speed (ms)
scrollText: false, //'Scroll to top', // Text for element
activeOverlay: false, // Set CSS color to display scrollUp active point, e.g '#00FFFF'
});
});
//=============================================================================
// Get data
//=============================================================================
function getData( input )
{
// Reset, show all
if ( input == '*RESET' ) {
input = '';
$('#input-show-next-prodid').val('N');
$('#input-fromdate').val('');
$('#input-fromtime').val('');
$('#input-todate').val('');
$('#input-totime').val('');
// Update input variables
input_fromdate = $('#input-fromdate').val();
input_fromtime = $('#input-fromtime').val();
input_todate = $('#input-todate').val();
input_totime = $('#input-totime').val();
//Clear search
thisGlobalTableData.search( '' );
}
//Only initialize datatables once, else just draw it
if ( $.fn.dataTable.isDataTable( '#REEFTvisual_data' ) ) {
thisGlobalTableData.draw(); // fire in the hole
}
else {
setDataTables();
}
}
//=============================================================================
// Set datatables
//=============================================================================
function setDataTables()
{
// Delete allowed?
GLOBAL_DELETE_ALLOWED = 'N';
if ( GLOBAL_DELETE_ALLOWED == 'Y' ) {
var show_the_delete_button = true;
} else {
var show_the_delete_button = false;
}
// Get the current date line
input_fromdate = $('#input-fromdate').val();
input_fromtime = $('#input-fromtime').val();
input_todate = $('#input-todate').val();
input_totime = $('#input-totime').val();
$('#REEFTvisual_data').DataTable({
"ajax": {
"url": 'hub_log_maintain_get.php',
"data": function (parmData) {
// add custom parameters to the ajax call
// parmData.custom = $('#myInput').val();
if (input_fromdate.trim() != '') parmData.fromdate = input_fromdate.trim();
if (input_fromtime.trim() != '') {
input_fromtime = input_fromtime.concat(":00");
parmData.fromtime = input_fromtime;
}
if (input_todate.trim() != '') parmData.todate = input_todate.trim();
if (input_totime.trim() != '') {
input_totime = input_totime.concat(":00");
parmData.totime = input_totime;
}
// Add custom parameters to the ajax call
// Webservice name
parmData.hub_webnam = input_hub_webnam;
// From date
parmData.fromdate = input_fromdate.trim();
parmData.fromtime = input_fromtime;
// To date
parmData.todate = input_todate.trim();
parmData.totime = input_totime;
},
dataSrc: function (jsonData) { //return data
var myCMPNO = jsonData.header.myCMPNO;
var myCMPNO_Name = jsonData.header.myCMPNO_Name;
var myFile_name = jsonData.header.myFile_name
var myFile_description = jsonData.header.myFile_description
var returnCode = jsonData.header.returnCode;
var returnMsg = jsonData.header.returnMsg;
var entries_found = jsonData.header.entries_found;
var response_sec = jsonData.header.response_sec;
// Show load time
$('#load-time-from-database').html('entries found: ' + entries_found + ' (' + response_sec + ')');
return jsonData.data;
}
},
"processing": true,
"serverSide": true,
"responsive": true,
"fixedHeader": true,
"lengthMenu": [[10, 25, 50, 100, 250], [10, 25, 50, 100, 250]],
"iDisplayLength": 25,
"dom": 'lfip<bottom>Bp<"clear">',
"order": [[ 0, "desc" ]],
"columns": [
{ data: "TIMESTAMP" },
{ data: "LOGCODE" },
{ data: "LOGPGM" },
{ data: "DATALINE" },
{ defaultContent: '<button class="edit-btn btn btn-primary mr-1"><?php echo $datahub_button_show_details ?></button>' },
{ defaultContent: '<button class="delete-btn btn btn-danger"><?php echo $datahub_button_delete ?></button>'},
],
"columnDefs": [
{
"targets": [ 4 ],
"visible": true,
"searchable": false,
"orderable": false
},
{
"targets": [ 5 ],
"visible": show_the_delete_button,
"searchable": false,
"orderable": false
},
{
"targets": [ 3 ],
"className": "text-truncate-dt" //class to mimic text-truncate in dt
},
],
"language":
{
"processing": "<i class=\"fa fa-spinner fa-spin fa-3x fa-fw\"></i><span class=\"sr-only\"><?php echo $datahub_datatable_Processing ?></span>",
"sProcessing": "<?php echo $datahub_datatable_Processing ?>",
"sLengthMenu": "<?php echo $datahub_datatable_LengthMenu ?>",
"sZeroRecords": "<?php echo $datahub_datatable_ZeroRecords ?>",
"sInfo": "<?php echo $datahub_datatable_Info ?>",
"sInfoEmpty": "<?php echo $datahub_datatable_InfoEmpty ?>",
"sInfoFiltered": "<?php echo $datahub_datatable_InfoFiltered ?>",
"sInfoPostFix": "<?php echo $datahub_datatable_InfoPostFix ?>",
"sLoadingRecords": "<?php echo $datahub_datatable_Processing ?>",
"sSearch": "<?php echo $datahub_datatable_Search ?>",
"sUrl": "<?php echo $datahub_datatable_Url ?>",
"oPaginate": {
"sFirst": "<?php echo $datahub_datatable_First ?>",
"sPrevious": "<?php echo $datahub_datatable_Previous ?>",
"sNext": "<?php echo $datahub_datatable_Next ?>",
"sLast": "<?php echo $datahub_datatable_Last ?>"
}
},
"rowCallback": function(row, data, index)
{
},
"preDrawCallback": function(settings)
{
},
"initComplete": function ()
{
},
"buttons": [
{
extend: 'pdf',
text: '<img src="images/pdf_logo.png" height="25"> PDF',
orientation: 'landscape',
title: 'Config - Data Export - PDF',
exportOptions: {
modifier: {
page: 'all'
}
}
},
{
extend: 'excel',
text: '<img src="images/microsoft_excel_logo.png" height="25"> Excel',
title: 'Config Data Export - Excel',
},
{
extend: 'copy',
text: '<img src="images/copy.png" height="25"> Copy to Clipboard',
title: 'Config Data Export - Copy',
},
]
});
//=============================================================================
// Setup the data to be able to update the table without reloading from the server
//=============================================================================
// Save the table in a global variable
thisGlobalTableData = $('#REEFTvisual_data').DataTable();
// Handle click on "Edit" button
$('#REEFTvisual_data tbody').on('click', '.edit-btn', function() {
thisCurrentRow = $(this).closest('tr');
thisGlobalRowData = thisGlobalTableData.row(thisCurrentRow).data();
// Debug
// console.log("edit");
// console.log(thisGlobalRowData);
// console.log(thisCurrentRow);
dataShow();
});
// Handle click on "Edit" button
$('#REEFTvisual_data tbody').on('click', '.delete-btn', function() {
thisCurrentRow = $(this).closest('tr');
thisGlobalRowData = thisGlobalTableData.row(thisCurrentRow).data();
// Debug
// console.log(thisGlobalRowData);
// console.log(thisCurrentRow);
dataDeleteConfirm();
});
//=============================================================================
}
//=============================================================================
// Reason addd -- not used
//=============================================================================
function dataAdd ( input_pk_type )
{
$('#input-mode').val('*add');
$('#modal-input-ACTIVE').val('Y'); // Active
$('#modal-input-CFGNAM').val(''); // DATA-HUB cfg name
$('#modal-input-CFGTYP').val(''); // DATA-HUB cfg type
$('#modal-input-CFGDSC').val(''); // Config description
$('#modal-input-CFGVAL').val(''); // DATA-HUB cfg value
$('#modal-input-CFGDAT').val(''); // Create date
$('#modal-input-CFGTIM').val(''); // Create time
// Reset save field(s)
//save_CFGNAM = '';
// Set active - default YES
$('#button-deleted-yes').removeClass('btn-primary').addClass('btn-success');
$('#button-deleted-no').removeClass('btn-success').addClass('btn-primary');
// Reset modal message
resetModalMessage();
// Remove key fields readonly
$('#modal-input-CFGNAM').removeAttr('readonly','readonly');
$('#data-result-button-lines-modal').removeClass('d-none');
// Show modal
$('#log_MaintainModal').modal('show');
$('#log_MaintainModal').on('shown.bs.modal', function () {
//$('#modal-input-WZLIN').trigger('focus');
$('#modal-input-CFGNAM').trigger('focus');
})
}
//=============================================================================
// Show details
//=============================================================================
function dataShow( )
{
$('#input-mode').val('*update');
var row = thisGlobalRowData;
// Save in fields
var TIMESTAMP = row["TIMESTAMP"];
var LOGCODE = row["LOGCODE"];
var LOGPGM = row["LOGPGM"];
var DATALINE = row["DATALINE"];
var counter = row["counter"];
// Move to input fields
$('#modal-input-counter').val(counter); // counter (used as id)
$('#modal-input-TIMESTAMP').val(TIMESTAMP); // timestamp
$('#modal-input-LOGCODE').val(LOGCODE); // Log code
$('#modal-input-LOGPGM').val(LOGPGM); // Log program
$('#modal-input-DATALINE').val(DATALINE); // Log line
// Make key fields readonly
$('#modal-input-DATALINE').attr('readonly','readonly');
$('#data-result-button-lines-modal').addClass('d-none');
$('.read-only-class').attr('readonly','readonly');
// Reset modal message
resetModalMessage();
// Show modal
$('#log_MaintainModal').modal('show');
$('#log_MaintainModal').on('shown.bs.modal', function () {
//$('#modal-input-WZSEQ').trigger('focus');
//myWZDON = thisGlobalRowData[7];
//setWZDON_button( myWZDON );
})
}
//=============================================================================
// Delete confirm
//=============================================================================
function dataDeleteConfirm( )
{
$('#input-mode').val('*delete');
var row = thisGlobalRowData;
var input_TIMESTAMP = row["TIMESTAMP"];
$('#confirm-delete-HUB_TIMESTAMP').val(input_TIMESTAMP);
// Create confirm text
$('#confirm-delete-text-TIMESTAMP').html(input_TIMESTAMP);
$('#config_confirmDeleteModal').modal('show');
}
//=============================================================================
// Delete
//=============================================================================
function dataDeleteExec()
{
// Reset modal message
resetModalMessage();
var mode = $('#input-mode').val();
// Make array and json
var myData = $('#dataForm-delete').find('input, select').serializeArray();
var result = JSON.stringify(myData);
//we don't use delete for now so return here...
// console.log(result);
console.log(myData);
return;
var parmData = 'data=' + result
+ '&mode=' + mode
;
$.ajax({
url: "hub_config_maintain_save.php",
type: "POST",
data: parmData,
dataType: "json",
cache: false,
})
.done(function( jsonData ) {
$('#config_confirmDeleteModal').modal('hide');
getData('');
})
.always(function( jsonData ) {
})
.fail(function( xhr, ajaxOptions, thrownError ) {
console.log('I am failed..');
console.log( xhr );
});
}
//=============================================================================
// Show deleted
//=============================================================================
function showDeleted()
{
var show_deleted = $('#input-show-deleted').val();
if ( show_deleted == 'Y' ) {
$('#button-show-deleted').html('<?php echo $datahub_NO ?>');
$('#input-show-deleted').val('N');
} else {
$('#button-show-deleted').html('<?php echo $datahub_YES ?>');
$('#input-show-deleted').val('Y');
}
getData('');
}
//=============================================================================
// Log off
//=============================================================================
function signoff()
{
window.location.href = "logout.php";
}
//=============================================================================
// Load page
//=============================================================================
function loadPage(url, p1, p2, p3)
{
window.location.href = url;
}
//=============================================================================
// Reset modal message
//=============================================================================
function resetModalMessage() {
// Reset
//$('#modal-message').removeClass('p-2 font-weight-bold border border-danger rounded bg-light').html( ' ' );
$('#modal-message').removeClass('border-bottom').html( ' ' );
$('#modal-save-button').removeClass('disabled').prop("disabled", false);
}
//=============================================================================
// Clean input string
//=============================================================================
function cleanInputString( myWorkField )
{
let charactersToRemove = '?#"\'';
let myPattern = new RegExp('[' + charactersToRemove + ']', 'g');
myWorkField = myWorkField.replace(myPattern,'');
return myWorkField;
}
//=============================================================================
// Full screen popup
//=============================================================================
function popUpFull( url, p1, p2, p3 )
{
var winname = 'win_' + url;
params = 'width='+screen.width;
params += ', height='+screen.height;
params += ', top=0, left=0'
params += ', fullscreen=yes';
params += ',scrollbars=1';
overview_win = window.open(url,winname, params);
if (window.focus) {overview_win.focus()}
return false;
}
//=============================================================================
// screen popup - center
//=============================================================================
function popUpCenter(url, p1, p2, p3)
{
var v1_w = screen.availWidth;
var v1_h = screen.availHeight;
if ( parseInt(v1_w) > 1800 ) {
v1_w = 1800;
v1_h = v1_h - 200;
v1_center = v1_w/0.8;
}
// Center popup as good as possible
var left = (screen.width - v1_w) / 2;
var top = (screen.height - v1_h) / 4;
var winname = 'win_' + url;
params = 'width='+v1_w;
params += ', height='+v1_h;
params += ', top=' + top + ', left=' + left;
params += ', fullscreen=yes';
params += ',scrollbars=1';
overview_win = window.open(url,winname, params);
if (window.focus) {overview_win.focus()}
return false;
}
//=============================================================================
// screen popup - center - bigger
//=============================================================================
function popUpCenterBig(url, p1, p2, p3)
{
var v1_w = screen.availWidth;
var v1_h = screen.availHeight;
// Get 25%
v1_w_pct = v1_w * 0.25;
v1_w_new = v1_w - v1_w_pct;
if ( v1_w_new < 1 ) {
v1_w_new = 1800;
}
v1_w = v1_w_new;
v1_h = v1_h - 200;
v1_center = v1_w/0.8;
// Center popup as good as possible
var left = (screen.width - v1_w) / 2;
var top = (screen.height - v1_h) / 4;
var winname = 'win_' + url;
params = 'width='+v1_w;
params += ', height='+v1_h;
params += ', top=' + top + ', left=' + left;
params += ', fullscreen=yes';
params += ',scrollbars=1';
overview_win = window.open(url,winname, params);
if (window.focus) {overview_win.focus()}
return false;
}
//=============================================================================
// Popup top
//=============================================================================
function popUpTop(url, p1, p2, p3)
{
var winname = 'win_' + url;
w = 650;
h = 750;
params = 'width='+w;
params += ', height='+h;
params += ', top=0, left=0'
params += ', fullscreen=no';
params += ',scrollbars=1';
overview_win = window.open(url,winname, params);
if (window.focus) {overview_win.focus()}
return false;
}
//=============================================================================
// Set clock
//=============================================================================
function updateClock() {
var currentTime = moment().format('YYYY-MM-DD HH:mm:ss');
currentTime = REEFT_format_date( currentTime, DFT_DATE_DISPLAY_FORMAT )
$('#current-time').html( currentTime );
}
//=============================================================================
// jQuery - Ready
//=============================================================================
$(document).ready(function()
{
// Do not show deleted
$('#input-show-deleted').val('Y');
// Get data done by datatables
setDataTables();
//-----------------------------------------------------------------------
// Start the clock
//-----------------------------------------------------------------------
updateClock();
setInterval(function() {
updateClock();
}, 1000);
//-----------------------------------------------------------------------
//-----------------------------------------------------------------------
// Set font awesome icon type
//-----------------------------------------------------------------------
// Value is from config/config.php
var iconType = '<?php echo $DFT_SET_FONT_AWESOME_ICON_TYPE ?>';
setFontAwesomeIconType( iconType );
//-----------------------------------------------------------------------
//-----------------------------------------------------------------------
// Delay keyup checker
//-----------------------------------------------------------------------
var delay = (function () {
var timer = 0;
return function (callback, ms) {
clearTimeout(timer);
timer = setTimeout(callback, ms);
};
})()
// DataTable search delay
$('#REEFTvisual_data_wrapper .dataTables_filter input')
.unbind() // overrule normal behavior
.bind('keyup', function(e){
var inputValue = $('.dataTables_filter input').val();
var currSearchValue = $('#input-search-line').val();
if (inputValue != currSearchValue) {
$('#input-search-line').val( inputValue );
//If enter or delete we update immediately, consider to add backspace=8 also
const keyList = [13,46];
if (keyList.includes(e.keyCode)) {
// console.log('immediately ' + inputValue );
thisGlobalTableData.search(inputValue).draw(); // fire in the hole
} else {
delay(function () {
// console.log('this will hit, once user has not typed for 1 second ' + inputValue );
thisGlobalTableData.search(inputValue).draw(); // fire in the hole
}, 0800);
}
}
});
//-----------------------------------------------------------------------
// Event listener for the update button
//-----------------------------------------------------------------------
$('#updateButton').on('click', function() {
// Update input variables
input_fromdate = $('#input-fromdate').val();
input_fromtime = $('#input-fromtime').val();
input_todate = $('#input-todate').val();
input_totime = $('#input-totime').val();
// Trigger a redraw of the table
thisGlobalTableData.draw();
});
//-----------------------------------------------------------------------
// Set short cuts
//-----------------------------------------------------------------------
// If add d-none class, do not add shortcut
if ( GLOBAL_ADD_ALLOWED == 'Y' ) {
shortcut.add("Alt+F6",function() {
$('#add-button').click();
});
}
});
// -->
</script>
</head>
<body>
<div class="container-fluid mt-2 pl-3 pr-3">
<input type="text" class="d-none" id="input_search">
<input type="text" class="d-none" id="input-mode" >
<input type="text" class="d-none" id="input-show-deleted" >
<input type="text" class="d-none" id="input-search-line">
<input type="text" class="d-none" id="input-filter-line">
<input type="text" class="d-none" id="input-show-next-prodid">
<input type="text" class="d-none" id="input-rpyOffSet">
<input type="text" class="d-none" id="input-rpyTotalRecordsFound">
<input type="text" class="d-none" id="input-rpyTotalPages">
<input type="text" class="d-none" id="input-rpyPageSize">
<div class="row">
<div class="col-2">
<img src="images/customer-logo.png" alt="Customer Logo">
</div>
<div class="col-8 text-center <?php echo $DFT_CLOCK_SIZE ?>">
<i class="font-awesome-pseudo-class fa-thin fa-clock"></i> <span id="current-time"><?php echo date('d-m-Y h:i:s') ?></span>
</div>
<div class="col-2 text-right">
<div class="btn btn-primary mb-1" onclick="loadPage('menu_admin.php','','','')" title="<?php echo $datahub_go_to_my_dear_home ?>"><i class="font-awesome-pseudo-class fa-2x fa-thin fa-home"></i></div>
<div class="d-none">
<div class="btn btn-primary mb-1 d-none d-xl-inline-block" onclick="loadPage('menu_main.php','','','')" title="<?php echo $datahub_go_to_my_dear_home_03 ?>"><i class="font-awesome-pseudo-class fa-2x fa-thin fa-fort"></i></div>
<div class="btn btn-danger mb-1 d-none d-lg-inline-block" onclick="signoff()" title="<?php echo $datahub_go_to_my_dear_home_02 ?>"><i class="font-awesome-pseudo-class fa-thin fa-2x fa-right-from-bracket"></i></div>
</div>
</div>
</div>
<div class="card mt-2">
<div class="card-header text-muted">
<div class="row mt-2">
<div class="col-4 h4">
<i class="font-awesome-pseudo-class fa-thin fa-anchor"></i> <?php echo "$datahub_text0116"; ?>
</div>
<div class="col text-right font-weight-bold d-none">
<button type="button" class="d-none btn btn-dark" id="button-toggle-show-deleted" title="Alt+F2=Toggle" onclick="showDeleted()"><?php echo $datahub_button_show_also_deleted ?> : <span id="button-show-deleted" class="font-weight-bold"><?php echo $datahub_YES ?></span></button>
<div class="row">
<div class="col-10 text-right">
</div>
<div class="col text-right">
<?php echo $datahub_text0059 ?> <span id="text-current-page">...</span> <?php echo $datahub_text0060 ?> <span id="text-total-pages">...</span>
</div>
</div>
<div class="row">
<div class="col-10 text-right">
</div>
<div class="col text-right">
<?php echo $datahub_text0061 ?> : <span id="text-total-records-found">...</span>
</div>
</div>
</div>
</div>
</div>
<div class="card-body">
<!-- Message if screen is not wide enough -->
<div class="container-fluid mt-2 mb-4 d-block d-lg-none">
<div id="general-message-top" class="border border-danger rounded p-2 text-danger font-weight-boldx"><?php echo $datahub_error0040a ?></div>
</div>
<!-- Message if screen is not wide enough -->
<!-- Lines found -->
<div class="row mb-4">
<div class="col-10">
<div id="data-result-button-lines"></div>
</div>
<div class="col-2 text-right">
</div>
</div>
<div class="row mb-4">
<div class="col-xl-4 col-lg-6 col-md-6 col-sm-4 col-xs-4 mt-1">
<div class="form-row">
<div class="col-3">
<?php echo $datahub_text0121 ?>
</div>
<div class="col-5">
<input id="input-fromdate" type="date" class="form-control rounded">
</div>
<div class="col-1 text-center">
/
</div>
<div class="col-3">
<input id="input-fromtime" type="time" class="form-control rounded">
</div>
</div>
</div>
<div class="col-xl-4 col-lg-6 col-md-6 col-sm-4 col-xs-4 mt-1">
<div class="form-row">
<div class="col-3">
<?php echo $datahub_text0122 ?>
</div>
<div class="col-5">
<input id="input-todate" type="date" class="form-control rounded">
</div>
<div class="col-1 text-center">
/
</div>
<div class="col-3">
<input id="input-totime" type="time" class="form-control rounded">
</div>
</div>
</div>
<div class="col-xl-4 col-lg-6 col-md-6 col-sm-4 col-xs-4 mt-1 text-right">
<button type="button" class="btn btn-primary mb-1" id="updateButton"><?php echo $datahub_button_get_data_icon2 ?></button>
<button type="button" class="btn btn-primary mb-1" onclick="getData('*RESET')"><?php echo $datahub_button_order_reset01_icon ?></button>
</div>
</div>
<div class="row">
<div class="col">
<div id="data-result" style="width: 100%;"></div>
<table id="REEFTvisual_data" class="table nowrap table-bordered table-striped table-hover">
<thead>
<tr class="bg-primary text-white font-weight-bold text-center">
<th class="text-left"><?php echo $datahub_text0117 ?></th>
<th class="text-left"><?php echo $datahub_text0118 ?></th>
<th class="text-left"><?php echo $datahub_text0119 ?></th>
<th class="text-left"><?php echo $datahub_text0120 ?></th>
<th class="text-center"><button id="add-button" title="Shortcut: Alt+F6" onclick="dataAdd(\'' + '0' + '\')" class="d-none btn btn-dark font-weight-bold">' + '<?php echo $datahub_button_save_01 ?>' + '</button></th>
<th class="text-center"></th>
</tr>
</thead>
</table>
</div>
</div>
<div class="row">
<div class="col text-right mb-2">
<small><div id="load-time-from-database"></div></small>
</div>
</div>
</div>
</div>
</div>
<!-- Set footer -->
<?php
include "include/footer.php";
?>
<!-- Set footer -->
<!-- ========================================================================== -->
<!-- M O D A L S -->
<!-- ========================================================================== -->
<!-- Modal -->
<div class="modal fade" id="log_MaintainModal" tabindex="-1" data-backdrop="static" role="dialog" aria-labelledby="log_MaintainModalLabel" aria-hidden="true">
<div class="modal-dialog modal-xxl">
<div class="modal-content">
<div class="modal-header bg-primary text-white">
<div class="container-fluid pl-0 pr-0">
<div class="row">
<div class="col-8">
<h5 class="modal-title" id="log_MaintainModalLabel"><i class="font-awesome-pseudo-class fa-thin fa-anchor"></i> <?php echo $datahub_text0116 ?></h5>
</div>
<div class="col text-right">
</div>
<div class="col-1 text-right" style="max-width:20px">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
</div>
</div>
</div>
<div class="modal-body ml-2 mr-2">
<input type="text" class="d-none" id="input-current-color-picker">
<input type="text" class="d-none" id="input-current-text-color">
<input type="text" class="d-none" id="input-current-background-color">
<!-- Message if screen is not wide enough -->
<div class="container-fluid mt-2 mb-4 d-block d-lg-none">
<div id="general-message-top" class="border border-danger rounded p-2 text-danger font-weight-boldx"><?php echo $datahub_error0040a ?></div>
</div>
<!-- Message if screen is not wide enough -->
<form name="dataForm" id="dataForm">
<!-- Hidden fields start -->
<input type="text" class="d-none" id="modal-input-counter" name="modal-input-counter">
<!-- Hidden fields end -->
<div class="row mt-2">
<div class="col-7">
<div id="data-result-button-lines-modal"></div>
</div>
</div>
<div class="row mt-2">
<div class="col-2">
<?php echo $datahub_text0117 ?>
</div>
<div class="col-4">
<input class="form-control read-only-class" type="text" id="modal-input-TIMESTAMP" name="modal-input-TIMESTAMP">
</div>
</div>
<div class="row mt-2">
<div class="col-2">
<?php echo $datahub_text0118 ?>
</div>
<div class="col-4">
<input class="form-control read-only-class" type="text" id="modal-input-LOGCODE" name="modal-input-LOGCODE" maxlength="1">
</div>
<div class="col-2">
<?php echo $datahub_text0119 ?>
</div>
<div class="col-4">
<input class="form-control read-only-class" type="text" id="modal-input-LOGPGM" name="modal-input-LOGPGM">
</div>
</div>
<div class="row mt-2">
<div class="col-2">
<?php echo $datahub_text0120 ?>
</div>
<div class="col-10">
<textarea class="form-control" id="modal-input-DATALINE" name="modal-input-DATALINE" rows="10" ></textarea>
</div>
</div>
</form>
</div>
<div class="modal-footer-pretty modal-footer">
<div class="container-fluid">
<div class="row">
<div class="col-12 text-left">
<div class="p-1 font-weight-bold text-danger border-top border-dark " id="modal-message"> </div>
</div>
</div>
<div class="row mt-1 mb-2">
<div class="col-3 text-left">
<button type="button" id="modal-save-button" class="btn btn-primary btn-block d-none" onclick="dataSave()"><?php echo $datahub_button_save ?></button>
</div>
<div class="col-6 text-right">
</div>
<div class="col-3 text-right">
<button type="button" class="btn btn-primary btn-block" data-dismiss="modal"><?php echo $datahub_button_cancel_01 ?></button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- ************************************************ -->
<!-- Confirm delete -->
<!-- ************************************************ -->
<div class="modal fade" id="config_confirmDeleteModal" tabindex="-1" role="dialog" aria-labelledby="config_confirmDeleteModalLabel" aria-hidden="true">
<div class="modal-dialog modal-xl" role="document">
<div class="modal-content">
<div class="modal-header bg-primary text-white">
<h5 class="modal-title" id="config_confirmDeleteModalLabel"><?php echo $datahub_text0063 ?></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form name="dataForm-delete" id="dataForm-delete">
<input type="text" class="d-none" id="confirm-delete-HUB_TIMESTAMP" name="confirm-delete-HUB_TIMESTAMP">
</form>
<div class="h6"><?php echo $datahub_text0062 ?>: <span class="font-weight-bold" id="confirm-delete-text-TIMESTAMP"></span></div>
</div>
<div class="modal-footer">
<div class="container-fluid">
<div class="row mt-1 mb-2">
<div class="col-3 text-left">
<button type="button" onclick="dataDeleteExec()" class="btn btn-primary">Delete</button>
</div>
<div class="col-6 text-right">
</div>
<div class="col-3 text-right">
<button type="button" class="btn btn-primary" data-dismiss="modal">Cancel</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>